<template>
    <div class="userCenter">
        <Top></Top>
         <div class="userCenter-body">
          <div class="userCenter-textbody">
            <!-- 左边 -->
            <div class="textbody-left">
              <Navigater></Navigater>

            </div>
            <!-- 右边 -->
            <div class="textbody-right">
              <router-view></router-view>

             </div>

          </div>

       
            
         </div>

    </div>
  
</template>

<script>
import Top from '@/components/home/Top.vue';
import Navigater from "@/components/userCenter/Navigater.vue"
export default {
      name:"App",
      components:{
        Top,Navigater
      }
}
</script>

<style>
*{
    margin: 0;
    padding: 0;  
}
  body,html{
   width: 100%;
   height: fit-content;
   min-width: 1510px;
    max-width: 1510px;
}
  .top{
    position: fixed;
    min-width: 1535px;
  }
.publish{
border: 1px solid greenyellow;
padding-bottom: 10px;
border-radius: 2.5ch;
background-color: greenyellow;
color: white;
display: block;
width: 60px;
height: 25px;
text-align: center;
line-height: 20px;
}
  .userCenter-body{
    position: relative;
    display: flex;
    width: 100%;
    height: fit-content;
    justify-content: center;
    margin-top: 50px;
  }
  .userCenter-textbody{
    flex-basis: 1200px;
    height: 100%;
    display: flex;

  }
  .textbody-left{
    /* background-color: aqua; */
    flex-grow: 1;
    position: fixed;
    
  }
  .textbody-right{
    /* background-color: rgb(221, 211, 240); */
    flex-grow: 10;
    position: absolute;
    left: 380px;
    width: 900px;
  }
  

</style>